import Taro, { Component } from '@tarojs/taro'
import { View, Image, Text } from '@tarojs/components'
import { DNavBar, DCheckOpinion } from '@/components'
import './detail/index.scss'
import http from '@/api'

export default class InventoryManageDetail extends Component {
  state = {
    carIcon: require('@/assets/images/car_icon.png'),
    fileIcon: require('@/assets/images/file_icon.png'),
    opinions: [
      {
        name: '继续盘库',
        value: 'success',
      }, {
        name: '订单完成',
        value: 'fail',
      }],
    detail: {},
    basicInfo: [],
    carInfo: [],
    imageList: [],
  }

  componentDidMount () {
    // this.getStocktaking()
    this.getMortgageDeatil() // 获取按揭详情数据
  }

  // 获取按揭详情数据
  getMortgageDeatil() {
    let params = {
      id: this.$router.params.id
    }
    // http.getMortgageListHis(params).then((data) => {
    //   let MortgageDeatil =data
    // })
    http.getMortgageListHis(params).then((data) => {
      let arr = ['', '建设银行', '农业银行', '金融产品', '工商银行', '中国银行']
      let infoData = data.anJie[0].financialApply
      infoData.bankType = arr[infoData.bankType]
      this.handleInfo(infoData)
      this.setState({ detail: infoData }, () => {
        // console.log(this.state)
      })
    })
  }

  // getStocktaking () {
  //   http.getStocktaking(this.$router.params.id).then((data) => {
  //     let infoData = {
  //       ...data.info,
  //       ...data.carAdvanceMoneyApply,
  //     }

  //     let imageList = this.handleImages(data.detail)

  //     this.handleInfo(infoData)
  //     this.setState({ detail: infoData, imageList, status: data.info.status })
  //   })
  // }

  handleInfo (detail) {
    const basicInfoMap = {
      'orderCode': '关联订单号',
      'bankType': '放款银行',
      'payments': '分期数',
      'customerName': '车主姓名',
      'carType': '车型',
      'momey': '实际放款金额',
      'points': '办理网点',
      'customerManager': '客户经理',
    }


    let basicInfo = []
    let carInfo = []

    Object.keys(basicInfoMap).forEach(key => {
      if (key == 'momey') {
        detail.momey = detail.momey + '元'
      }
      basicInfo.push({
        label: basicInfoMap[key],
        value: detail[key] || '--',
      })
    })
    // Object.keys(carInfoMap).forEach(key => {
    //   carInfo.push({
    //     label: carInfoMap[key],
    //     value: detail[key] || '--',
    //   })
    // })

    this.setState({ basicInfo, carInfo })
    console.log(this.setState)
  }

  handleImages (list) {
    let imageList = list.map((item) => {
      let isPanku
      if (item.status == 1 || item.status == 3) {
        isPanku = false
      } else if (item.status == 2 || item.status == 4) {
        isPanku = true
      }
      let objectTemp = {
        stocktakingArea: item.stocktakingArea,
        stocktakingDate: item.stocktakingDate,
        carImg: [],
        carinImg: [],
        infoImg: [],
        abnormalImg: [],
        isPanku,
        updator: item.updator,
      }
      item.carStocktakingFiles.forEach((imgObj) => {
        let obj = {}
        if (imgObj.imgType === 1) {
          obj['url'] = imgObj.imgAliyunUrl
          obj['deg'] = imgObj.imgTitle
          objectTemp.carImg.push(obj)
        } else if (imgObj.imgType === 2) {
          obj['url'] = imgObj.imgAliyunUrl
          obj['deg'] = imgObj.imgTitle
          objectTemp.carinImg.push(obj)
        } else if (imgObj.imgType === 3) {
          obj['url'] = imgObj.imgAliyunUrl
          obj['deg'] = imgObj.imgTitle
          objectTemp.infoImg.push(obj)
        } else if (imgObj.imgType === 4) {
          obj['url'] = imgObj.imgAliyunUrl
          obj['deg'] = imgObj.imgTitle
          objectTemp.abnormalImg.push(obj)
        }
      })

      return objectTemp
    })

    return imageList
  }

  handleStatusText (status) {
    return {
      1: '待盘库',
      2: '已盘库',
      // 3: '继续盘库',
      3: '待盘库',
      4: '订单完成',
    }[status]
  }

  handleStatusBarClass (status) {
    return {
      1: 'no-pass',
      2: 'pass',
      // 3: '继续盘库',
      3: 'no-pass',
      4: 'pass',
    }[status]
  }

  confirmPanku (id) {
    http.confirmPanku(id).then(() => {
      Taro.showToast({
        title: '确认成功',
        icon: 'success',
      })
      setTimeout(Taro.navigateBack, 2000)
    })
  }

  continuePanku (id) {
    http.continuePanku(id).then(({ data }) => {
      Taro.showToast({
        title: '确认成功',
        icon: 'success',
      })
      setTimeout(Taro.navigateBack, 2000)
    })
  }

  handleConfirm = ({ checkOpinion }) => {
    Taro.showModal({
      title: '提示',
      content: '是否确认提交该信息',
      success: ({ confirm }) => {
        if (confirm) {
          if (checkOpinion === 'success') {
            // 继续盘库
            this.continuePanku(this.$router.params.id)
          } else {
            // 订单完成
            this.confirmPanku(this.$router.params.id)
          }
        }
      },
    })
  }

  render () {
    const {
      opinions,
      fileIcon,
      carIcon,
      basicInfo,
      carInfo,
      detail,
      imageList,
      status,
    } = this.state
    return (
      <View className="inventory-manage-detail">
        <DNavBar title="按揭详情"></DNavBar>

        <View className={['status_bar', this.handleStatusBarClass(status)].join(
          ' ')}>{this.handleStatusText(status)}</View>

        <View className="info">
          <View className="title">
            <Image src={fileIcon} className="title_icon"></Image>
            <Text className="title_text">基本信息</Text>
          </View>
          {
            basicInfo.map(item => <View className="item">
              <View className="label">{item.label}</View>
              <View className="value" style={{fontWeight:'500'}}>{item.value}</View>
            </View>)
          }
	    </View>
        {
          status == 2 && <View>
            <View className="border"></View>
            <DCheckOpinion type="panKu" opinions={opinions} onCancel={Taro.navigateBack} onConfirm={this.handleConfirm}/>
          </View>
        }
      </View>
    )
  }
}
